import React, { Component } from 'react'
/* 
    定义状态的三个步骤的另外一种写法

*/
export default class Counter2 extends Component {
  //1、定义状态数据
  state={
    count:0
  }
  increment(){
    this.setState({
        count:this.state.count+1
    })
  }
  incrementN(n){
    this.setState({
        count:this.state.count+n
    })
  }
  render() {
    //2、使用ES6的对象的结构的形式依次将数据结构出来
    const {count}=this.state
    return (
      <div>
        <h1>计数器</h1>
        <h2>{count}</h2>
        <button onClick={this.increment.bind(this)}>+</button>
        <button onClick={()=>{this.incrementN(2)}}>+2</button>
        <button onClick={()=>{this.incrementN(3)}}>+3</button>
      </div>
    )
  }
}
